const { defineConfig } = require('@vue/cli-service');
//当前时间为了防止打包缓存不刷新, 给每个js文件都加一个时间戳
const Timestamp = new Date().getTime();
// 打包文件压缩
const CompressionPlugin = require("compression-webpack-plugin")
// 打包指定路径
const FileManagerPlugin = require('filemanager-webpack-plugin')

module.exports = defineConfig({
  runtimeCompiler: true,
  transpileDependencies: true,
  productionSourceMap: process.env.NODE_ENV !== "production",
  publicPath: process.env.NODE_ENV === "production" ? './' : '/',
  configureWebpack: {
    output: { // 输出重构  打包编译后的 文件名称  【模块名称.版本号.时间戳】
      filename: `js/[name].${Timestamp}.js`,
      chunkFilename: `js/[name].${Timestamp}.js`
    },
    plugins: [ //gzip压缩
      new CompressionPlugin({
        test: /\.js$|\.html$|\.css$|\.jpg$|\.jpeg$|\.png/, // 需要压缩的文件类型
        threshold: 10240, // 归档需要进行压缩的文件大小最小值，我这个是10K以上的进行压缩
        deleteOriginalAssets: false, // 是否删除原文件
        minRatio: 0.8
      }),
      //初始化 fileManager-webpack-plugin 插件实例
      new FileManagerPlugin({
        events: {
          onEnd: {
            //首先需要删除项目根目录下的dist.zip
            delete: [
              './dist/xz-blog.zip'
            ],
            //然后我们选择di文件夹将之打包成dist.zip并放在根目录st
            archive: [
              {
                source: './dist',
                destination: './dist/xz-blog.zip'
              }
            ]
          }
        }
      })
    ]
  },
  pluginOptions: {
    'style-resources-loader': {
      preProcessor: 'sass',
      patterns: []
    }
  },
  // css 样式
  css: {
    loaderOptions: {
      sass: {
        // 原属性 `prependData` 无效, 需要改为 `additionalData`
        additionalData: `@import "@/assets/scss/config.scss";`
      }
    }
  }
});

